<script setup lang="ts">
import { ref } from 'vue';

const details = defineProps({
    show: {
        type: Boolean,
        default: false
    }
})

// 关闭弹窗
const emits = defineEmits(['close'])
const closePopup = () => {
    console.log('关闭');

}
// 指定容器
const container:any = ref(null);
</script>
<template>
    <van-popup v-model:show="show"  :style="{ width: '100%', height: '80%', padding: '10px 10px 20px' }" :safe-area-inset-top="true" :safe-area-inset-bottom="true" ref="container">
        <van-sticky :container="container" z-index="120">
          <van-nav-bar title="反馈详情">
            <template #right>
                <van-icon name="cross" class="icon"/>
            </template>
          </van-nav-bar>
        </van-sticky>
        <div class="info">
            <van-row style="margin-bottom: 20px;">
                <van-col :span="6">课程名称：</van-col>
                <van-col :span="18">我想学《发财》</van-col>
            </van-row>
            <van-row style="margin-bottom: 20px;">
                <van-col :span="6">课程描述：</van-col>
                <van-col :span="18">就是很简单那的一个课程，发财就是很简单那的一个课程，发财就是很简单那的一个课程，发财就是很简单那的一个课程</van-col>
            </van-row>
            <van-row style="margin-bottom: 10px;">
                <van-col>附件：</van-col>
            </van-row>
            <van-row style="margin-bottom: 10px;" justify="start">
                <van-col v-for="item in 9" :key="item">
                    <van-image class="img" src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg" />
                </van-col>
            </van-row>
            <van-row style="margin-bottom: 20px;">
                <van-col :span="6">状态：</van-col>
                <van-col>已提交反馈</van-col>
            </van-row>
            <van-row style="margin-bottom: 20px;">
                <van-col :span="6">备注：</van-col>
                <van-col :span="18">不要你觉得，我要我觉得</van-col>
            </van-row>
        </div>
    </van-popup>
</template>

<style scoped lang="scss">

.icon {
    font-weight: 700;
    font-size: 18px;
}
.info {
    
    .img {
        width: 50px;
        height: 50px;
        margin-left: 8px;
    }
}
</style>